<template>
	<div class="priceRegion">
		<el-form :inline="true" :model="form" ref="form" label-width="180px">
			<el-row>
				<el-form-item label="线路">
					<span>{{$parent.$parent.$parent.line.srcCity}}</span>
					<span>-</span>
					<span>{{$parent.$parent.$parent.line.dstCity}}</span>
				</el-form-item>
			</el-row>
			<el-row>
				<el-form-item class='requir' label="开始时间" prop='startTime'>
					<el-date-picker v-model="form.startTime" type="datetime" format="yyyy-MM-dd HH:mm" placeholder="选择日期" style='width: 217px;'></el-date-picker>
				</el-form-item>
				<el-form-item class='requir' label="结束时间" prop='endTime' label-width="156px">
					<el-date-picker v-model="form.endTime" type="datetime" format="yyyy-MM-dd HH:mm" placeholder="选择日期" style='width: 217px;'></el-date-picker>
				</el-form-item>
			</el-row>
			<el-row>
				<el-form-item class='requir' label="调价类型" prop='ruleType'>
					<el-radio class="radio" v-model="form.ruleType" label="PERCENTAGE">百分比</el-radio>
					<el-radio class="radio" v-model="form.ruleType" label="PRICE">金额</el-radio>
					<el-radio class="radio" v-model="form.ruleType" label="IGNORE_MILEAGE">不计里程</el-radio>
				</el-form-item>
				<el-form-item label="价格" prop='adjust' v-if="form.ruleType != 'IGNORE_MILEAGE'" label-width="134px">
					<el-input v-model="form.adjust" style='width: 217px;'></el-input>
				</el-form-item>
			</el-row>
			<el-row>
				<el-col>
					<span class="price-region requir">调价区域(单选)</span>
					<el-form-item class='price-region-con' :label="$parent.$parent.$parent.line.srcCity" v-if="priceArea.dstAreaId==''" prop='srcAreaId' label-width="45px">
						<el-select v-model="priceArea.srcAreaId" placeholder="请选择区域">
							<el-option label="请选择" value=""></el-option>
							<el-option v-for="item in srcAreaList" :key="item.id" :label="item.name" :value="item.id"></el-option>
						</el-select>
					</el-form-item>
					<el-form-item :label="$parent.$parent.$parent.line.dstCity" v-if="priceArea.srcAreaId==''" prop='dstAreaId' label-width="110px">
						<el-select v-model="priceArea.dstAreaId" placeholder="请选择区域">
							<el-option label="请选择" value=""></el-option>
							<el-option v-for="item in dstAreaList" :key="item.id" :label="item.name" :value="item.id"></el-option>
						</el-select>
					</el-form-item>
					<el-button type="primary" icon="plus" @click="regionAdd">添加区域</el-button>
				</el-col>
			</el-row>
			<el-row>
				<el-form-item class='requir' label="调价服务(多选)" prop='checkList' label-width="180px">
					<el-checkbox-group v-model="checkList" prop='checkList'>
						<el-checkbox label="拼车"></el-checkbox>
						<el-checkbox label="包车"></el-checkbox>
					</el-checkbox-group>
				</el-form-item>
				<el-button type="primary" icon="plus" @click="addValidateForm()">添加</el-button>
				<el-button type="danger" icon="setting" @click="resetForm('form')">重置</el-button>
			</el-row>
		</el-form>
		<el-table :data="PRTableData" border fit style="width: 100%">
			<el-table-column align='center' min-width="175" prop="" label="开始时间">
				<template scope="props">
					<span>{{dateFormat(props.row.startTime,'yyyy-MM-dd hh:mm')}}</span>
				</template>
			</el-table-column>
			<el-table-column align='center' min-width="175" prop="" label="结束时间">
				<template scope="props">
					<span>{{dateFormat(props.row.endTime,'yyyy-MM-dd hh:mm')}}</span>
				</template>
			</el-table-column>
			<el-table-column align='center' min-width="140" prop="areaName" label="调价区域"></el-table-column>
			<el-table-column align='center' min-width="140" prop="cityName" label="所属城市"></el-table-column>
			<el-table-column align='center' min-width="120" prop="" label="调价服务">
				<template scope="props">
					<span>{{tripModeShow(props.row.tripMode)}}</span>
				</template>
			</el-table-column>
			<el-table-column align='center' min-width='70px' prop="" label="价格">
				<template scope="props">
					<span>{{priceShow(props.row.ruleType,props.row.adjust)}}</span>
				</template>
			</el-table-column>
			<el-table-column align='center' min-width='90px' prop="level" label="优先级">
				<template scope="scope">
					<i class="el-icon-caret-top" @click="changeList(scope.$index)"></i>
				</template>
			</el-table-column>
			<el-table-column align='center' label="操作" min-width='175px'>
				<template scope="scope">
					<el-button @click="revise(scope.row)" icon='edit' type="primary" size='small'>修改</el-button>
					<el-button @click="del(scope.$index, scope.row)" icon="delete" type="danger" size='small'>删除</el-button>
				</template>
			</el-table-column>
		</el-table>
		<el-dialog v-model="isRevisePR" class='revisePRDialog' title="修改调价区域" size='small'>
			<el-form :inline="true" :model="revisePRInfo" label-width="180px">
				<el-row>
					<el-form-item label="线路">
						<span>{{$parent.$parent.$parent.line.srcCity}}</span>
						<span>-</span>
						<span>{{$parent.$parent.$parent.line.dstCity}}</span>
					</el-form-item>
				</el-row>
				<el-row>
					<el-form-item class='requir' label="开始时间">
						<el-date-picker v-model="revisePRInfo.startTime" type="datetime" format="yyyy-MM-dd HH:mm" placeholder="选择日期"></el-date-picker>
					</el-form-item>
					<el-form-item class='requir' label="结束时间">
						<el-date-picker v-model="revisePRInfo.endTime" type="datetime" format="yyyy-MM-dd HH:mm" placeholder="选择日期"></el-date-picker>
					</el-form-item>
				</el-row>
				<el-row>
					<el-form-item class='requir' label="调价类型">
						<el-radio class="radio" v-model="revisePRInfo.ruleType" label="PERCENTAGE">百分比</el-radio>
						<el-radio class="radio" v-model="revisePRInfo.ruleType" label="PRICE">金额</el-radio>
						<el-radio class="radio" v-model="revisePRInfo.ruleType" label="IGNORE_MILEAGE">不计里程</el-radio>
					</el-form-item>
					<el-form-item label="价格" v-if="revisePRInfo.ruleType != 'IGNORE_MILEAGE'" label-width="134px">
						<el-input v-model="revisePRInfo.adjust" style='width: 193px;'></el-input>
					</el-form-item>
				</el-row>
				<el-row>
					<el-col>
						<span class="price-region">调价区域(单选)</span>
						<el-form-item class='price-region-con' :label="$parent.$parent.$parent.line.srcCity" v-if="revisePriceArea.dstAreaId==''" label-width="45px">
							<el-select v-model="revisePriceArea.srcAreaId" placeholder="请选择区域">
								<el-option label="请选择" value=""></el-option>
								<el-option v-for="item in srcAreaList" :key="item.id" :label="item.name" :value="item.id"></el-option>
							</el-select>
						</el-form-item>
						<el-form-item class='price-region-con' :label="$parent.$parent.$parent.line.dstCity" v-if="revisePriceArea.srcAreaId==''" label-width="45px">
							<el-select v-model="revisePriceArea.dstAreaId" placeholder="请选择区域">
								<el-option label="请选择" value=""></el-option>
								<el-option v-for="item in dstAreaList" :key="item.id" :label="item.name" :value="item.id"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-form-item class='requir' label="调价服务">
						<el-checkbox-group v-model="reviseCheckList">
							<el-checkbox label="拼车"></el-checkbox>
							<el-checkbox label="包车"></el-checkbox>
						</el-checkbox-group>
					</el-form-item>
				</el-row>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="isRevisePR=false">取 消</el-button>
				<el-button type="primary" icon='upload2' @click="reviseValidateForm('revisePRInfo')">提 交</el-button>
			</div>
		</el-dialog>
		<el-dialog v-model="isEdit" :close-on-click-modal="false">
			<el-form :model="regionInfo" label-width="120px" ref="regionInfo">
				<el-form-item label="所属城市" prop="cityId" :rules="[{required: true,message: '请选择所属城市'}]">
					<el-select v-model="currentCityName" placeholder="请选择城市" @change="" :disabled="isAddRegion">
						<el-option v-for="item in currentCityList" :key="item.id" :label="item.name" :value="item"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="区域名称" prop="name" :rules="[{required: true,message: '区域名称不能为空'}]">
					<el-input v-model="regionInfo.name" auto-complete="off" :disabled="isAddRegion"></el-input>
				</el-form-item>
				<el-form-item label="区域简拼" prop="pinyin" :rules="[{required: true,message: '区域简拼不能为空'}]">
					<el-input v-model="regionInfo.pinyin" auto-complete="off" :disabled="isAddRegion"></el-input>
				</el-form-item>
				<el-form-item label="区域范围" prop="points">
					<template scope="scope">
						<baiduMap :cityName="cityName" :regionInfo="regionInfo" :isEdit="isEdit" @message="getPoints"></baiduMap>
					</template>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="isEdit=false">取 消</el-button>
				<el-button type="primary" @click.native="submit('regionInfo')" :loading="loading" v-if="!isAddRegion">提 交</el-button>
			</div>
		</el-dialog>
	</div>
</template>
<script>
	export default {
		name: 'priceRegion',
		data() {
			return {
				lineId: '',
				updateId: '',
				isRevisePR: false,
				isEdit: false,
				loading: false,
				isAddRegion: false,
				currentCityList: [],
				cityName: "",
				currentCityName: "",
				srcAreaList: [],
				dstAreaList: [],
				checkList: [],
				priceArea: {
					dstAreaId: '',
					srcAreaId: ''
				},
				reviseCheckList: [],
				revisePriceArea: {
					dstAreaId: '',
					srcAreaId: ''
				},
				form: {
					startTime: '',
					endTime: '',
					ruleType: '',
					adjust: '',
					cityId: '',
					areaId: '',
					tripMode: '',
					lineId: ''
				},
				PRTableData: [],
				revisePRInfo: {
					startTime: '',
					endTime: '',
					ruleType: '',
					adjust: '',
					cityId: '',
					areaId: '',
					tripMode: '',
					lineId: ''
				},
				regionInfo: {
					cityId: "",
					name: "",
					pinyin: "",
					cityName: "",
					coordinates: "[]"
				},
				points: [],
			}
		},
		components: {
			baiduMap: require("./../sub/baiduMap.vue")
		},
		methods: {
			regionAdd() {
				this.isAddCity = true;
				this.isAddRegion = false;
				this.regionInfo.cityId = "";
				this.regionInfo.name = "";
				this.regionInfo.pinyin = "";
				this.regionInfo.points = [];
				console.log(this.currentCityName);
				if(typeof(this.currentCityName) == "object") {
					this.cityName = this.currentCityName.name;
				} else {
					this.cityName = this.currentCityName;
				}

				setTimeout(() => {
					this.isEdit = true;
				}, 0);
			},
			submit(formName) {
				var _this = this;
				var data = "param=" + JSON.stringify({
					cityId: _this.regionInfo.cityId,
					areaId: _this.regionInfo.id,
					name: _this.regionInfo.name,
					pinyin: _this.regionInfo.pinyin,
					points: _this.points
				});
				// 新增
				this.$refs[formName].validate((valid) => {
					if(valid) {
						this.$http.post("/addPriceAdjustArea.shtml", data).then(result => {
							if(result.code == 200) {
								_this.$notify({
									title: '成功',
									message: "信息添加成功",
									type: 'success'
								});

								_this.regionInfo.cityId = "";
							}
							_this.isEdit = false;
							_this.useCityUsePoint();
						}).catch(error => {
							console.log(error);
						})
					} else {
						return false;
					}
				});
				this.currentCityName = "";
			},
			getPoints(points) {
				this.points = points;
			},
			getPriceAreaList() {
				var that = this;
				this.lineId = window.location.href.split('=')[1];
				this.$http.get('/linePriceAreaList.shtml', {
					params: {
						lineId: that.lineId,
					}
				}).then(function(data) {
					if(data.code == 200) {
						that.PRTableData = data.data;
					}
				});
			},
			useCityUsePoint() {
				var srcCityId = this.$parent.$parent.$parent.line.srcCityId;
				var dstCityId = this.$parent.$parent.$parent.line.dstCityId;
				this.getCityAreaList(srcCityId, 1);
				this.getCityAreaList(dstCityId, 2);
			},
			getCityAreaList(id, val) {
				var that = this;
				this.$http.get('/lineAreaList.shtml', {
						params: {
							cityId: id
						}
					})
					.then(function(data) {
						if(data.code == 200) {
							if(val == "1") {
								that.srcAreaList = data.data;
							} else {
								that.dstAreaList = data.data;
							}
						}
					});
			},
			revise(row) {
				this.isRevisePR = true;
				this.revisePriceArea = {
					dstAreaId: '',
					srcAreaId: ''
				};
				this.revisePRInfo = JSON.parse(JSON.stringify(row));
				if(row.tripMode == "SHARE") {
					this.reviseCheckList = ['拼车'];
				} else if(row.tripMode == "CHARTER") {
					this.reviseCheckList = ['包车'];
				} else if(row.tripMode == "BOTH") {
					this.reviseCheckList = ['拼车', '包车'];
				}
				if(row.cityId == this.$parent.$parent.$parent.line.srcCityId) {
					this.revisePriceArea.srcAreaId = row.areaId;
				} else if(row.cityId == this.$parent.$parent.$parent.line.dstCityId) {
					this.revisePriceArea.dstAreaId = row.areaId;
				}
			},
			reviseValidateForm() {
				if(this.revisePRInfo.startTime && !this.revisePRInfo.endTime) {
					this.validateNotify('请选择结束时间！');
				} else if(!this.revisePRInfo.startTime && this.revisePRInfo.endTime) {
					this.validateNotify('请选择开始时间！');
				} else if(!this.revisePRInfo.startTime && !this.revisePRInfo.endTime) {
					this.validateNotify('请选择开始时间和结束时间！');
				} else if(new Date(this.revisePRInfo.startTime).getTime() > new Date(this.revisePRInfo.endTime).getTime()) {
					this.validateNotify('结束时间必须大于开始时间！');
				} else if(this.revisePRInfo.ruleType == '') {
					this.validateNotify('请选择调价类型！');
				} else if(this.revisePRInfo.ruleType == 'PERCENTAGE' && ~~this.revisePRInfo.adjust && ~~this.revisePRInfo.adjust < 0 || ~~this.revisePRInfo.adjust > 100) {
					this.validateNotify('调价类型为百分比价格必须大于0小于100！');
				} else if(~~this.revisePRInfo.adjust && this.revisePRInfo.ruleType == 'PRICE' && ~~this.revisePRInfo.adjust < 0) {
					this.validateNotify('调价类型为金额，价格必须大于0！');
				} else if(!this.revisePRInfo.adjust && this.revisePRInfo.ruleType == 'PERCENTAGE') {
					this.validateNotify('调价类型为百分比，请必须填写价格！');
				} else if(!this.revisePRInfo.adjust && this.revisePRInfo.ruleType == 'PRICE') {
					this.validateNotify('调价类型为金额，请必须填写价格！');
				} else if(!this.revisePriceArea.srcAreaId && !this.revisePriceArea.dstAreaId) {
					this.validateNotify('请选择调价区域！');
				} else if(this.reviseCheckList.length == 0) {
					this.validateNotify('请选择调价服务！');
				} else {
					this.update();
				}
			},
			update() {
				var that = this;
				if(this.revisePriceArea.srcAreaId && !this.revisePriceArea.dstAreaId) {
					this.revisePRInfo.cityId = this.$parent.$parent.$parent.line.srcCityId;
					this.revisePRInfo.areaId = this.revisePriceArea.srcAreaId;
				} else if(!this.revisePriceArea.srcAreaId && this.revisePriceArea.dstAreaId) {
					this.revisePRInfo.cityId = this.$parent.$parent.$parent.line.dstCityId;
					this.revisePRInfo.areaId = this.revisePriceArea.dstAreaId;
				}
				this.revisePRInfo.startTime = new Date(this.revisePRInfo.startTime).getTime();
				this.revisePRInfo.endTime = new Date(this.revisePRInfo.endTime).getTime();
				this.revisePRInfo.lineId = this.lineId;
				for(var i = 0; i < this.reviseCheckList.length; i++) {
					if(this.reviseCheckList.length == 1 && this.reviseCheckList[i] == "拼车") {
						this.revisePRInfo.tripMode = 'SHARE';
					} else if(this.reviseCheckList.length == 1 && this.reviseCheckList[i] == "包车") {
						this.revisePRInfo.tripMode = 'CHARTER';
					} else if(this.reviseCheckList.length == 2) {
						this.revisePRInfo.tripMode = 'BOTH';
					}
				}
				if(this.reviseCheckList.length == 0) {
					this.revisePRInfo.tripMode = '';
				}
				this.$http.post("/updatePriceArea.shtml",
					"param=" + JSON.stringify(this.revisePRInfo)
				).then(function(data) {
					if(data.code == 200) {
						that.getPriceAreaList();
						that.isRevisePR = false;
						that.$notify({
							title: '成功',
							message: '修改成功',
							type: 'success'
						});
					}
				});
			},
			addValidateForm() {
				if(this.form.startTime && !this.form.endTime) {
					this.validateNotify('请选择结束时间！');
				} else if(!this.form.startTime && this.form.endTime) {
					this.validateNotify('请选择开始时间！');
				} else if(!this.form.startTime && !this.form.endTime) {
					this.validateNotify('请选择开始时间和结束时间！');
				} else if(new Date(this.form.startTime).getTime() > new Date(this.form.endTime).getTime()) {
					this.validateNotify('结束时间必须大于开始时间！');
				} else if(this.form.ruleType == '') {
					this.validateNotify('请选择调价类型！');
				} else if(this.form.ruleType == 'PERCENTAGE' && ~~this.form.adjust && ~~this.form.adjust < 0 || ~~this.form.adjust > 100) {
					this.validateNotify('调价类型为百分比价格必须大于0小于100！');
				} else if(~~this.form.adjust && this.form.ruleType == 'PRICE' && ~~this.form.adjust < 0) {
					this.validateNotify('调价类型为金额，价格必须大于0！');
				} else if(!this.form.adjust && this.form.ruleType == 'PERCENTAGE') {
					this.validateNotify('调价类型为百分比，请必须填写价格！');
				} else if(!this.form.adjust && this.form.ruleType == 'PRICE') {
					this.validateNotify('调价类型为金额，请必须填写价格！');
				} else if(!this.priceArea.srcAreaId && !this.priceArea.dstAreaId) {
					this.validateNotify('请选择调价区域！');
				} else if(this.checkList.length == 0) {
					this.validateNotify('请选择调价服务！');
				} else {
					this.add();
				}
			},
			add() {
				var that = this;
				var data = [];
				if(this.priceArea.srcAreaId && !this.priceArea.dstAreaId) {
					this.form.cityId = this.$parent.$parent.$parent.line.srcCityId;
					this.form.areaId = this.priceArea.srcAreaId;
				} else if(!this.priceArea.srcAreaId && this.priceArea.dstAreaId) {
					this.form.cityId = this.$parent.$parent.$parent.line.dstCityId;
					this.form.areaId = this.priceArea.dstAreaId;
				}
				this.form.startTime = new Date(this.form.startTime).getTime();
				this.form.endTime = new Date(this.form.endTime).getTime();
				this.form.lineId = this.lineId;
				for(var i = 0; i < this.checkList.length; i++) {
					if(this.checkList.length == 1 && this.checkList[i] == "拼车") {
						this.form.tripMode = 'SHARE';
					} else if(this.checkList.length == 1 && this.checkList[i] == "包车") {
						this.form.tripMode = 'CHARTER';
					} else if(this.checkList.length == 2) {
						this.form.tripMode = 'BOTH';
					}
				}
				data.push(this.form);
				this.$http.post("/addPriceArea.shtml",
					"param=" + JSON.stringify(data)
				).then(function(data) {
					if(data.code == 200) {
						that.getPriceAreaList();
						that.resetForm('form');
						that.$notify({
							title: '成功',
							message: '添加成功',
							type: 'success'
						});
					}
				});

			},
			del(index, row) {
				var that = this;
				this.$confirm('确认删除该线路的调价区域?', '删除线路调价区域', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					var id = {
						id: row.id
					};
					this.$http.post("/deletePriceArea.shtml",
						"param=" + JSON.stringify(id)
					).then(function(data) {
						if(data.code == 200) {
							that.getPriceAreaList();
							that.$message({
								type: 'success',
								message: '删除成功!'
							});
						}
					});
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});
				});
			},
			changeList(index) {
				var that = this;
				var temp;
				if(index === 0 || index > this.PRTableData.length - 1) {
					return this.PRTableData;
				}
				temp = this.PRTableData[index];
				this.PRTableData[index] = this.PRTableData[index - 1];
				this.PRTableData[index - 1] = temp;
				this.PRTableData = JSON.parse(JSON.stringify(this.PRTableData));
				var data = {};
				data.lineId = this.lineId;
				var priorityId = [];
				for(var i = 0; i < this.PRTableData.length; i++) {
					priorityId[i] = this.PRTableData[i].id;
				}
				data.priorityId = priorityId.toString();
				this.$http.post("/priorityPriceArea.shtml",
					"param=" + JSON.stringify(data)
				).then(function(data) {
					console.log(data);
					if(data.code == 200) {
						that.getPriceAreaList();
						that.$notify({
							title: '成功',
							message: '重新成功排序',
							type: 'success'
						});
					}
				});
			},
			tripModeShow(tripMode) {
				if(tripMode == 'SHARE') {
					return '拼车';
				} else if(tripMode == 'CHARTER') {
					return '包车';
				} else if(tripMode == 'BOTH') {
					return '拼车,包车';
				}
			},
			priceShow(ruleType, adjust) {
				if(ruleType == "PRICE") {
					return adjust;
				} else if(ruleType == 'PERCENTAGE') {
					return adjust + '%';
				}
			},
			dateFormat: function(time, fmt) {
				if(!time) {
					return "";
				}
				var d = new Date(time);
				var o = {
					"M+": d.getMonth() + 1, //月份   
					"d+": d.getDate(), //日   
					"h+": d.getHours(), //小时   
					"m+": d.getMinutes(), //分   
					"s+": d.getSeconds(), //秒   
					"q+": Math.floor((d.getMonth() + 3) / 3), //季度   
					"S": d.getMilliseconds() //毫秒   
				};
				if(/(y+)/.test(fmt))
					fmt = fmt.replace(RegExp.$1, (d.getFullYear() + "").substr(4 - RegExp.$1.length));
				for(var k in o)
					if(new RegExp("(" + k + ")").test(fmt))
						fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
				return fmt;
			},
			resetForm(formName) {
				this.$refs[formName].resetFields();
				this.checkList = [];
				this.priceArea = {
					dstAreaId: '',
					srcAreaId: ''
				}
			},
			validateNotify(mes) {
				this.$notify({
					type: 'error',
					title: '提示',
					message: mes
				});
			}
		},
		watch: {
			"$parent.$parent.$parent.lineDetail": function(name) {
				if(name == "priceRegion") {
					this.useCityUsePoint();
					this.getPriceAreaList();
					this.currentCityList = [];
					this.currentCityList.push({
						id: this.$parent.$parent.$parent.line.srcCityId,
						name: this.$parent.$parent.$parent.line.srcCity
					});
					this.currentCityList.push({
						id: this.$parent.$parent.$parent.line.dstCityId,
						name: this.$parent.$parent.$parent.line.dstCity
					});
					if(typeof(this.currentCityName) == "object") {
						this.cityName = this.currentCityName.name;
						this.regionInfo.cityId = city.id;
					} else {
						this.cityName = this.currentCityName;
					}
				}
			},
			"$parent.$parent.$parent.line": function(name) {
				if(this.$parent.$parent.$parent.lineDetail == "priceRegion") {
					this.useCityUsePoint();
					this.currentCityList = [];
					this.currentCityList.push({
						id: this.$parent.$parent.$parent.line.srcCityId,
						name: this.$parent.$parent.$parent.line.srcCity
					});
					this.currentCityList.push({
						id: this.$parent.$parent.$parent.line.dstCityId,
						name: this.$parent.$parent.$parent.line.dstCity
					});
				}
			},
			"currentCityName": function(city) {
				console.log(city);
				if(typeof(this.currentCityName) == "object") {
					this.cityName = this.currentCityName.name;
					this.regionInfo.cityId = city.id;
				} else {
					this.cityName = this.currentCityName;
				}
			}
		},
		created() {
			if(sessionStorage.getItem("tabIdx") == "priceRegion") {
				this.getPriceAreaList();
			}
		}
	}
</script>
<style>
	.priceRegion .price-region {
		width: 180px;
		display: inline-block;
		text-align: right;
		vertical-align: middle;
		float: left;
		font-size: 14px;
		color: #48576a;
		line-height: 1;
		padding-right: 12px;
		padding-top: 11px;
		box-sizing: border-box;
		margin-bottom: 22px;
	}
	
	.priceRegion .price-region:before {
		content: '*';
		color: #ff4949;
		margin-right: 10px;
	}
	
	.priceRegion .requir .el-form-item__label:before {
		content: '*';
		color: #ff4949;
		margin-right: 6px;
	}
	
	.priceRegion .pagination {
		padding: 30px 0 0 40px !important;
	}
	.priceRegion .price-region-con .el-form-item__label{
		padding: 11px 12px 11px 0;
    	text-align: left;
	}
	.priceRegion .revisePRDialog .el-dialog--small{
		width: 875px !important;
	}
</style>